import React, { useEffect, useMemo, useState } from 'react'
import Taro, { usePullDownRefresh } from '@tarojs/taro'
import QRCode from '@/utils/weapp-qrcode.js'
import {RoundNum} from '@/utils/helper'
import {View,Image,Text} from '@tarojs/components'
import './index.scss'

export default function ReturnApply() {
  const [info,setInfo] = useState({})
  useEffect(()=>{
    _initData()
  },[])
  const _initData =e=>{
    Taro.showLoading({title:'加载中...'})
    Taro.$post('/cinema-app/api/v1/order/refund/pricing',{orderId:Taro.getCurrentInstance().router.params.id},'1').then(res=>{
      if(res.code == '1'){
        setInfo(res.content)
      }else{
        Taro.$toast(res.message)
      }
    })
  }
  return (
    <View className='return-apply'>
      <View className="apply-card">
        <View className="card-item">
          <View className="item-h2">退款次数</View>
        </View>
        <View className="card-item">
          <View className="item-label">本月可退款次数</View>
          <View className="item-p">剩余{info.leftRefundCount}次(共{info.totalRefundCount}次)</View>
        </View>
      </View>
      <View className="apply-card">
        <View className="card-item">
          <View className="item-h2">退款方式</View>
        </View>
        <View className="card-item">
          <View className="item-label">{info.refundMethod}</View>
          <View className="item-p sub-theme">现金将于1-7个工作日内退还到原支付方</View>
        </View>
      </View>
      <View className="apply-card">
        <View className="card-item">
          <View className="item-h2">退款次数</View>
          <View className="item-sub">退票手续费</View>
        </View>
        <View className="card-item">
          <View className="item-label">实付金额</View>
          <View className="item-p">¥{info.orderAmount || '0'}</View>
        </View>
        <View className="card-item">
          <View className="item-label">退票手续费</View>
          <View className="item-p">¥{info.refundHandleFee || '0'}</View>
        </View>
        <View className="card-item">
          <View className="item-label">实际退还</View>
          <View className="item-p sub-theme">¥{info.refundAmount || '0'}</View>
        </View>
      </View>
      <View className="apply-p">注意:提交退票申请后不可取消</View>
      <View className="apply-footer">
        <View className={`button ${info.leftRefundCount == '0'?'disabled':''}`} onClick={()=>{
          if(info.leftRefundCount<1) return;
          Taro.showModal({
            title:'退款申请',
            content:"是否提交申请?",
            success:res=>{
              if(res.confirm){
                Taro.showLoading({title:"加载中..."})
                Taro.$post('/cinema-app/api/v1/order/refund',{"orderId":Taro.getCurrentInstance().router.params.id},'1').then(ret=>{
                  if(ret.code == '1'){
                    Taro.$toast('提交成功','success')
                    setTimeout(() => {
                      Taro.navigateBack()
                    }, 1000);
                  }else{
                    Taro.$toast(ret.message)
                  }
                })
              }
            }
          })
        }}>提交退款申请</View>
      </View>
    </View>
  )
}
